<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.w3.org/1999/xhtml">
<head>
    <meta charset="UTF-8">
    <title>OA审批</title>
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no">
    <link href="https://cdn.bootcss.com/bootstrap/4.1.1/css/bootstrap-grid.min.css" rel="stylesheet">
    <link href="https://cdn.bootcss.com/bootstrap/4.1.1/css/bootstrap-reboot.min.css" rel="stylesheet">
    <link href="https://cdn.bootcss.com/bootstrap/4.1.1/css/bootstrap.min.css" rel="stylesheet">
    <script src="https://res.wx.qq.com/open/js/jweixin-1.2.0.js"></script>
    <script src="http://libs.baidu.com/jquery/2.1.4/jquery.min.js"></script>
</head>
<body>
<div class="card" style="width: 10rem;">
    <div class="card-body">
        这是OA审批的页面
    </div>
    <button>点我</button>
</div>
</body>
<script>

    $(function () {
        var url = location.href.split('#')[0];//url不能写死
        var agentId = '[[${agentId}]]'; //注意这里 要填写你自己得
        var templateId = '[[${templateId}]]'; //OA模板
        var thirdNo = '[[${thirdNo}]]'; //OA模板
        $("button").click(function () {
            $.ajax({
                type: "get",
                url: "/wx/jsapi/createJsapiSignature/" + agentId,
                dataType: "json",
                async: true,
                data: {url: url},
                success: function (data) {
                    wx.config({
                        beta: true,
                        debug: true,////生产环境需要关闭debug模式
                        appId: data.appId,//必填，企业微信的corpID
                        timestamp: data.timestamp,//生成签名的时间戳
                        nonceStr: data.nonceStr,//生成签名的随机字符串
                        signature: data.signature,//签名
                        jsApiList: ['agentConfig', 'openUserProfile', 'thirdPartyOpenPage', 'selectExternalContact']
                    });
                    wx.ready(function () {
                        wx.agentConfig({
                            corpid: res.data.corpId, // 必填，企业微信的corpid，必须与当前登录的企业一致
                            agentid: res.data.agentId, // 必填，企业微信的应用id
                            timestamp: res.data.timestamp, // 必填，生成签名的时间戳
                            nonceStr: res.data.noncestr, // 必填，生成签名的随机串
                            signature: res.data.agentSignature,// 必填，签名，见附录1
                            jsApiList: ['agentConfig', 'openUserProfile', 'thirdPartyOpenPage', 'selectExternalContact'], //必填
                            success: function (res) {
                                // 发起审批流程
                                wx.invoke('thirdPartyOpenPage', {
                                        "oaType": "10001",// String
                                        "templateId": templateId,// String
                                        "thirdNo": thirdNo,// 审批单号，开发者自己控制，不可重复
                                        "extData": {
                                            'fieldList': [{
                                                'title': '采购类型',
                                                'type': 'text',
                                                'value': '市场活动',
                                            }, {
                                                'title': '采购类型',
                                                'type': 'text',
                                                'value': '市场活动',
                                            }, {
                                                'title': '采购类型',
                                                'type': 'text',
                                                'value': '市场活动',
                                            }, {
                                                'title': '采购类型',
                                                'type': 'text',
                                                'value': '市场活动',
                                            }, {
                                                'title': '采购类型',
                                                'type': 'text',
                                                'value': '市场活动',
                                            }],
                                        }
                                    },
                                    function (res) {
                                        // 输出接口的回调信息
                                        console.log(res);
                                    });
                            },
                            fail: function (res) {
                                if (res.errMsg.indexOf('function not exist') > -1) {
                                    alert('版本过低请升级')
                                }
                            }
                        });
                    });
                },
                error: function (xhr, status, error) {
                    alert(xhr.responseText);
                }
            })
        });
    });
</script>
</html>
